﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css">
    body 
    {
    	background-image:url(img/PrettyDog.jpg);
    	background-attachment:fixed;
    }
    .layout
    {
    	height:400px;
    	position:fixed;
    	background-color:blue;
    }
    .inverted
    {
    	filter: FlipH;
    }
    </style>
</head>
<body>
    <div>
        <img src="img/map-shandong.gif" class="inverted" alt="Map of Shandong" width="750px" height="750px" usemap="#shandong" />
        <map name="shandong" id="shandong">
            <area shape="rect" coords="0,0,115,90" href="http://baike.baidu.com/view/3393.htm" alt="Qing Dao" />
            <area shape="circle" coords="113,39,187,21,180,72,141,77,117,86" href="http://baike.baidu.com/view/2994.htm" alt="Ji Nan" />
        </map>
    </div>
    <div class="layout" >
        <img src="img/Member.png" width="63px" height="63px" alt="Member" longdesc="http://www.google.com.hk" />
    </div>
    <div>For layout</div>
</body>
</html>
